
$(document).ready(function () {
	$('#groupfields ul').hide();
	$('#groupfields ul:first').show();
	$('#grouptab span:first').addClass('current');
	$('#grouptab span a').click(function () {
		// Focus current tab
		$('#grouptab span').removeClass('current');
		$(this).parent().addClass('current');

		// Show current group
		var currentTab = $(this).attr('href');
		$('#groupfields ul').hide();
		$(currentTab).show();

		return false;
	});

	// Disabler
	$('#toolbar1, #groupform').disabler();

	// Collspan/ Expand
	$('ul.accordeon-tabs li').each(function () {
		$(this).find(".tab").click(function () {
			if ($(this).parent().attr("class") == "open") {
				$(this).parent().removeClass("open");
				$(this).parent().addClass("close");
				$(this).parent().find(".panel").css("display", "none");
			}
			else {
				$(this).parent().removeClass("close");
				$(this).parent().addClass("open");
				$(this).parent().find(".panel").css("display", "block");
			}
		});
	});

	$(".calendar-date").datepicker();
	$(".calendar-time").timepicker();
	$(".start-time").timepicker();
	$(".calendar-datetime").datetimepicker();
	$(".cal").datepicker();
});

var addLeadViewModel = new function () {
	this.LeadType = ko.observable(data.LeadSelected);
	this.LeadTypeOptions = ko.observableArray(data.LeadType);

	this.LeadSource = ko.observable(data.LeadSource[0].ID);
	this.LeadSourceOptions = ko.observableArray(data.LeadSource);

	this.User = ko.observable(data.UserId);
	this.UserOptions = ko.observableArray(data.UserFilter);

	// Add new requirement
	this.EnableLeadType = ko.computed(function () {
		return !(!this.LeadTypeOptions() || !this.LeadTypeOptions().length || this.LeadTypeOptions().length <= 1);
	}, this);
	this.PleaseMessage = ko.computed(function () {
		return this.EnableLeadType() ? "Please select Lead Type and Lead Source to enable the form below."
			: "Please select Lead Source to enable the form below.";
	}, this);

	this.LeadTypeAndSourceAreValid = ko.computed(function () {
		var leadTypeId = parseInt(this.LeadType()),
			leadSourceId = parseInt(this.LeadSource());

		return (!isNaN(leadSourceId) && leadSourceId > 0 && (!this.EnableLeadType() || (!isNaN(leadTypeId) && leadTypeId > 0) ));
	}, this);

	this.EnableMessage = ko.computed(function () {
		if (!this.LeadTypeAndSourceAreValid()) {
			$(".disabler").show();
			return true;
		}

		//else
		$(".disabler").hide();
		return false;
	}, this);

	this.toolbarClass = ko.computed(function () {
		return (!this.LeadTypeAndSourceAreValid()) ? "toolbar errors" : "toolbar";
	}, this);

};

$(document).ready(function () {
	$("form#myForm #toolbargroup .sel-lead-type select:first").change(function () {
		var selectedLeadType = parseInt( $(this).val() );

		window.location = (!isNaN(selectedLeadType) && selectedLeadType > 0)
			? ("/Lead/AddLead?id=" + selectedLeadType) : "/Lead/AddLead";
	});

	/*$("form#myForm #toolbargroup .sel-lead-source select:first").change(function () {
		var selectedLeadSource = parseInt( $(this).val() );

		if (!isNaN(selectedLeadSource) && selectedLeadSource > 0) $(".disabler").hide();
		else $(".disabler").show();
	});*/


	//$("form").validate({ submitHandler: addLeadViewModel.Submit });
	$("form#myForm").validation();
	$("form#myForm #errorMessages").hide();

});

// We can check if the form is valid on demand, using our validate function.
function preValidateLeadForm(inp) {
	var $form = $(inp).closest("form");

	// Lead Type and Lead Source are required
	var isValid = false,
		leadSourceId = parseInt($form.find("#toolbargroup .sel-lead-source select:first").val()),
		leadTypeId = parseInt($form.find("#toolbargroup .sel-lead-type input[name='LeadType']").val());

	if (!isNaN(leadSourceId) && leadSourceId > 0) {

		if (!$form.find("#toolbargroup .sel-lead-type select:first option").length
			|| (!isNaN(leadTypeId) && leadTypeId > 0)) {

			isValid = true;
		}
	}

	if (isValid) {
		var groupErrorMessage = $form.find("#errorMessages");

		if ($form.validate()) {
			groupErrorMessage.hide();
			$(".fancybox-skin, #fancybox-overlay").show();

			$.fancybox($("#popup-sumitting"), {
				padding: 0,
				closeBtn: false,
				helpers: {
					overlay: {
						opacity: 0.6,
						css: {
							'background-color': '#11619D'
						}
					}
				},
				beforeClose: function () {
					return false;
				}
			});

			return true;	// Submit the form
		}
		else {
			// Add Error
			groupErrorMessage.find(".errorgrid").html('<strong>Error: Invalid Data</strong><span>The form has not been saved; please correct the following errors:<br /></span><ul class="errorlist" style="margin-top:10px; margin-left:20px"></ul>');

			// Find error messages
			$form.find("#grouptab a.nexttab").each(function () {
				var $lnk = $(this),
					tabName = $lnk.text();

				$("ul" + $lnk.attr("href").replace(/^.*?#+/g, "#") + " li").each(function () {
					$(this).find(".error-desc").each(function () {
						groupErrorMessage.find(".errorlist").append("<li>" + tabName + " &raquo; " + $(this).html() + "</li>");
					});
				});
			});

			groupErrorMessage.show();
		}
	}

	return false;
}

// Apply view model
addLeadViewModel.errors = ko.validation.group(addLeadViewModel);
ko.applyBindings(addLeadViewModel, document.getElementById("main"));
